<template>
  <div id="index">
    <div class="left">
      <div class="main">
        <span class="company">员工统计</span>
        <div class="bottom">
          <!-- 数量 -->
          <dv-digital-flop :config="config" style="width: 100%; height: 50px" />
        </div>
        <!-- 员工技术 -->
        <dv-scroll-ranking-board
          :config="ranking"
          style="width: 100%; height: 300px"
        />
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      config: {
        number: [31563],
        content: "{nt}人",
        style: {
          fontSize: 40,
        },
      },
      ranking:{
        data:[
        {
      name: '研发',
      value: 18312
    },
    {
      name: '销售',
      value: 7810
    },
    {
      name: '实施',
      value: 4100
    },
    {
      name: '设计',
      value: 2012
    },
    {
      name: '会计',
      value: 1888
    },
    {
      name: '其他',
      value: 1200
    },
  
        ] ,
         carousel: 'single',
        unit: '人'
      }
    };
  },
};
</script>

<style lang="less" scoped>
#index {
  color: #ccc;
  padding: 15px 0;
  .left {
    width: 350px;
    height: 360px;
    padding: 10px;
    margin: 0 auto;
    border-radius: 15px;
    box-sizing: border-box;
    background: rgba(13, 23, 51, 0.7);
    // margin-top: 20px;
    //   margin-right: 20px;
    .main {
      .company {
        display: block;
        height: 30px;
        line-height: 30px;
        // margin-top: 10px;
        margin-left: 10px;
      }
      .bottom {
        font-size: 14px;
        line-height: 22px;
        color: #ccc;
        padding: 10px;
        img {
          width: 100%;
          height: 150px;
        }
      }
    }
  }
}
</style>
